<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>dom</title>

	<script type="text/javascript">
		window.onload = function  () {
			// box = document.getElementsByName('box');
			
			// box=document.getElementById('box');

			// box=document.getElementsByClassName('box');

			// box[0].onclick = function  () {
			// 	alert(777)
			// }
			// 
			// input = document.getElementById('in');
			// input.onkeypress    = function  () {
			// 	alert("我失去焦点了");
			// }

			box=document.getElementById('box');

			box.onclick = function  () {
				alert("我被点击了")
			}

			box.onmouseover = function  () {
				alert("我进来了")
			}

			box.onmouseout = function  () {
				alert("我出去")
			}

			i =0;
			box.onmousemove  = function  () {
				box.innerHTML = i;
				i++;
				
			}



			
		}
	</script>
	<style type="text/css">
		#box{
			width: 200px;
			height: 200px;
			background: red url() 0 0 no-repeat;
		}


	</style>

</head>
<body>
	<input type="text" id="in" >
	<p id="box" >学并思</p>
	<p class="box">学并思</p>
	<p class="box">学并思</p>
	<p name="box">学并思</p>
	<p>学并思</p>

</body>
</html>